<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>文字溢出</title>
	</head>
	<style>
		.main{
			display: flex;
		}
		.other{
			margin: 10px;
			width: 200px;
			background-color: aqua;
		}
		.item2{
			white-space: nowrap;   /* 限制不换行 */
			overflow: auto;  /* 滚动内容 */
		}
		
		.item3{
			width: 200px ;
			background-color: aqua;
			white-space: nowrap; /* 文本不换行 */
			overflow: hidden; /* 溢出内容隐藏 */
			text-overflow: ellipsis; /* 溢出内容显示省略号 */
		}

	</style>
	<body>
		<div class="main">
			<div class="item1 other">
				本篇文章从一个 Canvas 小白的角度来实现一个完整的裁剪工具，实现到最后发现其实并没有涉及到很多 Canvas 内容，更多的还是实现思路。
			</div>
			
			
			<div class="item2 other">
				本篇文章从一个 Canvas 小白的角度来实现一个完整的裁剪工具，实现到最后发现其实并没有涉及到很多 Canvas 内容，更多的还是实现思路。
			</div>
			
			<div class="item3">
				本篇文章从一个 Canvas 小白的角度来实现一个完整的裁剪工具，实现到最后发现其实并没有涉及到很多 Canvas 内容，更多的还是实现思路。
			</div>
			
		</div>
		
	</body>
</html>